<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="../js/vue.js"></script>
</head>
<body>
    <div id="app">
        <!-- v-for 实现数组和对象的遍历 -->
        <!-- 语法 v-for='(value,index) in arr'  v-for='(value,key,index) in obj'  -->
        <!-- <div v-for = 'value in arr'><p>{{value}}</p></div> -->
        <!-- <div v-for = '(value,index) in arr'>{{index}}</div> -->
        <!-- <div ><p v-for = 'value in arr'>{{value}}</p></div> -->

        <!-- <div v-for = 'value in stuList'>{{value}}</div>遍历数组 -->
        <!-- <div v-for = 'value in stuList'><p v-for= 'value in stuList'>{{value.id}}{{value.name}}{{value.age}}</p></div> -->

        <!-- <div v-for ='val in stuList'><span>{{val.id}}--</span><span>{{val.name}}--</span><span>{{val.age}}--</span></div> -->

        <table>
            <thead>
                <th v-for = '(value) in stuList'>{{value.key}}</th>
            </thead>
            <tbody>
                <tr v-for='value in stuList'>
                    <td v-for = 'vul in value'>{{vul}}</td>
                </tr>
            </tbody>
        </table>

    </div>
</body>
<script>
    var vm = new Vue({
        el : '#app',
        data : {
            arr :[10,20,30,40,50,60,70,80,90],
            dog : {
                name : '狗狗',
                age : 2,
                color : 'yellow',
                gender :'boy'
            },
            stuList: [
                    {
                        id:1,
                        name: 'jack',
                        age: 20,
                        address: '广州黑马程序员'
                    },
                    {
                        id:2,
                        name: 'rose',
                        age: 18,
                        address: '广州黑马程序员'
                    },
                    {
                        id:3,
                        name: 'tom',
                        age: 19,
                        address: '广州黑马程序员'
                    }
                ]
        },
        method : {}
    })
</script>
</html>